{include file="../app/common/admin/lib/header.html"  title=""}
<style>
  .fold{
    width:600px;
    height: auto;
    overflow: hidden;
    border-top:1px solid #DDD;
    border-left:1px solid #DDD;
    border-right:1px solid #DDD;
  }
  .fold-group{
    height: auto;
    overflow: hidden;
    border-bottom: 1px solid #DDD;
  }
  .fold-title{
    padding:10px;
    height: 14px;
    font-size: 14px;
    font-weight: bold;
    color: #333;
    background: #F5F5F5;
  }
  .fold-content{
    padding-top:10px;
    padding-left:10px;
    font-size: 12px;
    color:#666;
    border-top:1px solid #DDD;
  }
  .hide{
    display: none;
  }
  .slt-input{
    float: left;
    margin-right:20px;
    margin-bottom: 10px; 
  }
</style>
<script type="text/javascript" src="{$Think.const.SITE_URL}/js/jqueryui/1.8.11/jquery.ui.timepicker-addon.js"></script>
<div class="page-header border-bottom clearfix">
  <h2 class="left">角色管理<span>{if $info}编辑{else}添加{/if}角色</span></h2>
  <a href="{:url('role/admin/index')}" class="btn btn-default btn-sm right">&lt;&nbsp;返回角色列表</a>
</div>
<!--start:码券新增-->
<div class="add-form">
  <form class="js_creatForm"  action="{:url('role/admin/save')}" method="post" enctype="multipart/form-data">
    <input type="hidden" name="id" value="{$info.id}">
    <table class="table" cellpadding="0" cellspacing="0">
    <tr>
      <th><label for="" class="add-f-label">角色：</label></th>
      <td>
        <input name="info[title]"  value="{$info.title}" type="text" class="add-f-ipt1 js_title">
        <div class="tips"><span style="line-height: 34px;color: #f00;margin-right: 10px;">*</span>请输入角色名称</div>
      </td>
    </tr>
    <tr>
      <th><label for="" class="add-f-label">角色权限：</label></th>
      <td>
        <!--{/*foreach $admin_menu_list as $k=>$v}-->
        <!--{$privilege = explode(',', $info.privilege)}-->
        <!--<div class="column">-->
          <!--<div class="parent" style="padding-left:0px;"><input type="checkbox" name="privilege[]" value="{$v.id}"  {if in_array($v.id, $privilege)}checked{/if} class="check">&nbsp;&nbsp;{$v.title}</div>-->
          <!--{foreach $v.sub as $k=>$subv}-->
            <!--<div class="sub"><input type="checkbox" name="privilege[]" value="{$subv.id}" {if in_array($subv.id, $privilege)}checked{/if} class="check">&nbsp;&nbsp;{$subv.title}</div>&nbsp;&nbsp;-->
          <!--{/foreach}-->
        <!--</div>-->
        <!--{/foreach*/}-->
          <div class="fold">
            {foreach $admin_menu_list as $key=>$value}
            {$privilege = explode(',', $info.privilege)}
            <div class="fold-group js_foldGroup">
              <div class="fold-title js_foldTitle">
                <input type="checkbox" name="privilege[]" class="js_parent" style="display:none;" value="{$value.id}">
                {$value.title}：<input type="checkbox" class="js_sltAll">&nbsp;<span class="js_sltAllText">全选</span>
              </div>
              <div class="fold-content js_foldContent" i-data="{$value.id}">
                {foreach $value.sub as $k=>$v}
                <div class="slt-input">
                  <input type="checkbox" class="js_sltPrivilege" name="privilege[]" value="{$v.id}" {if in_array($v.id, $privilege)}checked{/if}>
                  <span class="js_sltPrivilegeText">{$v.title}</span>
                </div>
                {/foreach}
              </div>
            </div>
            {/foreach}
          </div>
      </td>
    </tr>
    <tr><th>&nbsp;</th><td class="noborder"><button type="submit" class="btn btn-success js_submit">&nbsp;&nbsp;&nbsp;确认&nbsp;&nbsp;&nbsp;</button></td></tr>
    </table>
  </form>
</div>
<style>
  .btn{ width:100px;text-align:left; }
</style>
<!--end:城市新增-->
{js file='./static/js/ueditor1_2_6_1/ueditor.config.js'}
{js file='./static/js/ueditor1_2_6_1/ueditor.all.min.js'}
<script>
var oldObj = false;
$(function(){
  $('.js_submit').click(function(e){
    e.preventDefault();
    var title = $.trim($('.js_title').val());
    if (!title) {
      showMsg('角色标题不能为空');
      return;
    }
    
    $('.js_sltPrivilege').each(function(i){
        if ($(this).is(':checked')) {
          $(this).closest('.fold-group').find('.js_parent').attr('checked',true)
        }
    });
    $('.js_creatForm').submit();
  });
  // 初始化选中的权限
  var sltInputKey = "{$role_info.privilege}";
  if (sltInputKey) {
    var sltArr   = sltInputKey.split(',');
    var sltCount = sltArr.length;
    for (var i = 0; i < sltCount; i++) {
      $('[value="'+sltArr[i]+'"]input:').attr('checked', 'checked');
    };

    // 是否全选
    $('.js_sltAll').each(function(){
      var parentObj = $(this).closest('.js_foldGroup');
      var checkBox  = true;
      parentObj.find('.js_sltPrivilege').each(function(){
        if ($(this).attr('checked') != 'checked') {
          checkBox  = false;
        };
      });
      $(this).attr('checked', checkBox);
    });
  };
  // 是否全选
  $('.js_sltAll').each(function(){
    var parentObj = $(this).closest('.js_foldGroup');
    var checkBox  = true;
    parentObj.find('.js_sltPrivilege').each(function(){
      if ($(this).attr('checked') != 'checked') {
        checkBox  = false;
      };
    });
    $(this).attr('checked', checkBox);
  });
  // 初始化选择框  
 /*  $('.js_foldContent').each(function(){
    $(this).removeClass('hide');
    $(this).slideUp(0);
  }); */
  //showDiv($('.js_foldContent').eq(0), 300);

  $('.js_foldTitle').click(function(e){
    e.cancelBubble = true;
    //showDiv($(this).next(), 300);
  });

  $('.js_sltAll, .js_sltAll+span').click(function(e){
    var parentObj = $(this).closest('.js_foldGroup');
    var checkBox  = false;
    if ($(this).attr('class') == 'js_sltAllText') {
      if ($(this).prev().attr('checked') == 'checked') {
        $(this).prev().attr('checked', false);
      } else {
        $(this).prev().attr('checked', true);
        checkBox  = true;
      }
    }
    if ($(this).attr('checked') == 'checked') {
      checkBox  = true;
    }
    parentObj.find('.js_sltPrivilege').attr('checked', checkBox);
  });
  $('.js_sltPrivilege, .js_sltPrivilege+span').click(function(){
    var parentObj = $(this).closest('.js_foldGroup');
    var checkBox  = true;
    if ($(this).attr('class') == 'js_sltPrivilegeText') {
      if ($(this).prev().attr('checked') == 'checked') {
        $(this).prev().attr('checked', false);
        checkBox  = false;
      } else {
        $(this).prev().attr('checked', true);
      }
    }
    parentObj.find('.js_sltPrivilege').each(function(){
      if ($(this).attr('checked') != 'checked') {
        checkBox  = false;
      };
    });
    parentObj.find('.js_sltAll').attr('checked', checkBox);
  });
 /*  $('.sub').toggle(function(){
    $(this).children('.check').attr('checked', 'checked');
    $(this).prevUntil('.parent').children('checked', true);
  },function(){
    $(this).children('.check').attr('checked', false);
  });
  $('.parent').toggle(function(){
    $(this).children('.check').attr('checked', 'checked');
    //$(this).parentsUntil('column').childern('.sub').children('.check').attr('checked', true);
  }, function(){
    $(this).children('.check').attr('checked', false);
  }); */
});
//显示选择框
function showDiv(obj, fast){
  if (oldObj) {
    if (oldObj.attr('i-data') == obj.attr('i-data')){
      return false;
    }
    oldObj.slideUp(fast);
  }
  obj.slideDown(fast);

  oldObj = obj;
}
</script>
{include file="../app/common/admin/lib/footer.html"}